<template>
	<view class="container" >
		<u-form :model="form" ref="uForm" label-position="top">
			<u-form-item label="问题" prop="question">
				<u-input v-model="form.question" placeholder="请输入问题" type="textarea"/>
			</u-form-item>
			<u-form-item label="答案" prop="answer">
				<u-input v-model="form.answer" placeholder="请输入建议答案" type="textarea"/>
			</u-form-item>
			<u-button @click="submit" style="margin-top: 60rpx;">提交</u-button>
		</u-form>
	</view>
</template>

<script>
	import { addFaq } from '@/api/clientele.js'
	import {
		mapState
	} from 'vuex';
	export default {
		data() {
			return {
				form: {
					question: '',
					answer: '',
				},
				rules: {
					question: [
						{
							required: true,
							message: '请填写问题',
							trigger: ['blur']
						},
					],
					answer: [
						{
							required: true,
							message: '请填写建议答案',
							trigger: ['blur']
						},
					],
				}
			}
		},
		computed: {
			...mapState({
				area: state => state.user.tchInfo.area,
			})
		},
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},
		methods: {
			submit() {
				this.$refs.uForm.validate(valid => {
					console.log(valid);
					if (!valid) {
						return;
					}
					uni.showLoading({})
					addFaq(this.area.id, this.form.question, this.form.answer).then(res => {
						console.log(res);
						uni.hideLoading()
						const eventChannel = this.getOpenerEventChannel();
						eventChannel.emit('pushSuccessEvent', {data: 'test'});
						uni.navigateBack({})
					}).catch(error => {
						console.log(error);
						uni.hideLoading();
					})
				});
			}
		}
	}
</script>

<style lang="scss">
	.container{
		padding-left: 40rpx;
		padding-right: 40rpx;
	}
</style>
